/**
 * FormTable
 */
table.formTable {
    width: 100%;
    /*table-layout: fixed;*/
}

table.formTable tr td {
    text-align: right;
    padding: 10px 4px 4px 0px;
    vertical-align: top;
}

table.formTable tr td+td {
    text-align: left;
    padding: 4px 0px;
    vertical-align: middle;
}

table.formTable input[type=text],
table.formTable input[type=password] {
    min-width: 240px;
    width: 240px;
    -webkit-border-radius: 4px;
    border: 1px solid #d9d9d9;
    -webkit-box-shadow: 0px 1px 0px white;
    padding: 6px;
}

table.formTable input[type=checkbox] {
    margin-right: 6px;
}

table.formTable .error {
  
}

table.formTable td.left {
  width: 75px;
}

/**
 * CompactForm
 */
.compactForm .row {
    margin: 0px;
    padding: 4px;
    border-style: solid;
    border-width: 0px 1px 1px 1px;
    border-color: #d9d9d9;
    background-color: white;
}
.compactForm .row.rowPadded {
  padding: 4px 4px 4px 24px;
}
.compactForm .row.firstRow {
    border-top-width: 1px;
    -webkit-border-top-left-radius: 4px;
    -webkit-border-top-right-radius: 4px;
}
.compactForm .row.lastRow {
    -webkit-border-bottom-left-radius: 4px;
    -webkit-border-bottom-right-radius: 4px;
}
.compactForm input[type=text], 
.compactForm textarea {
    margin: 0px 0px 0px 0px;
    padding: 0px;
    border: none;
    width: 100%;
    -webkit-padding-start: 4px;
    -webkit-box-sizing: border-box;
}
.compactForm textarea {
    -webkit-padding-start: 5px;
    -webkit-transform: translate(0px, 2px);
}
.compactForm select {
    -webkit-appearance: button;
    border: none;
    padding: 0px;
    -webkit-padding-start: 4px;
    -webkit-padding-end: 20px;
    background-image: url(/images/icon_down_padded.png);
    background-position: center right;
    background-repeat: no-repeat;
}
.compactForm select:focus,
.compactForm input[type=submit]:focus {
    outline: auto;
    outline-color: #0c6c9c;
}
.compactForm .actions {
  text-align: right;
  margin-top: 10px;
}

/**
 * Submit with Options
 */

.clipSubmitContainer {
  position: relative;
}

/* Both the button and dropdown for our 'clip' control. */
select.clipTypeDropdown, #clipSubmitControl, #loginControl {
  font-family: Helvetica, sans-serif;
  font-weight: bold;
  font-size: 12px;
  color: #59595b;
  margin: 0;
  line-height: 14px;
  -webkit-border-radius: 4px;
  z-index: 400;
  padding: 6px 12px;
  border: 1px solid #b2c0a6;
  height: 28px;
}

#clipSubmitControl, #loginControl{
  background-image:
    -webkit-gradient(linear, left bottom, left top, color-stop(0, rgb(224,239,211)), color-stop(1, rgb(239,248,230)));
}

#clipSubmitControl:hover, #loginControl:hover {
  background-image:
    -webkit-gradient(linear, left top, left bottom, color-stop(0, rgb(224,239,211)), color-stop(1, rgb(239,248,230)));
}

#clipSubmitControl {
  -webkit-border-top-right-radius: 0px;
  -webkit-border-bottom-right-radius: 0px;
  position: absolute;
  right: 30px;
  z-index: 401;
}

select.clipTypeDropdown {
    width: 110px;
    max-width: 110px;
    border: 1px solid #BBB;
    padding-right: 30px;
    padding-left: 0;
    background-position: 94% 50%;
    outline: none;
    background-image: url(/images/icon_down_padded.png), -webkit-gradient(linear, left bottom, left top, color-stop(0, rgb(224,239,211)), color-stop(1, rgb(239,248,230)));
}

select.clipTypeDropdown:hover, select.clipTypeDropdown:focus {
    outline: none !important;
    background-image: url(/images/icon_down_padded_hi.png), -webkit-gradient(linear, left bottom, left top, color-stop(0, rgb(239,248,230)), color-stop(1, rgb(224,239,211)));
}

/**
 * Simple options table.
 * User on the options page.
 * It is basically a two column table with the first column listing the label for the option
 * and the second column listing options...
 */
table.simpleOptions {
    margin: 0px;
    padding: 0px;
    border-bottom: 1px solid #edf6f7;
    margin-bottom: 16px;
    width: 100%;
    table-layout: fixed;
}

table.simpleOptions td {
    width: 30%;
    vertical-align: top;
    padding: 8px 0px;
}

table.simpleOptions td+td {
    width: 70%;
}

table.simpleOptions td label {
    font-weight: bold;
}

table.simpleOptions td+td label {
    font-weight: normal;
}

table.simpleOptions tr.coupledRow td {
    padding: 2px 0px;
}
